<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>保险记录列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="resources/layui/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="resources/layui/css/public.css" media="all" />
</head>
<body class="childrenBody">
<form class="layui-form">
    <blockquote class="layui-elem-quote quoteBox">
        <form class="layui-form">
            <div class="layui-inline">
                <div class="layui-input-inline">
                    <input type="text" class="layui-input searchVal" placeholder="请输入车牌号" />
                </div>
                <a class="layui-btn search_btn" data-type="reload">搜索</a>
            </div>
            <div class="layui-inline">
                <a class="layui-btn layui-btn-normal addInsuranceRecord_btn">添加保险记录</a>
            </div>
            <div class="layui-inline">
                <a class="layui-btn layui-btn-danger layui-btn-normal delAll_btn">批量删除</a>
            </div>
        </form>
    </blockquote>
    <table id="insuranceRecordsList" lay-filter="insuranceRecordsList"></table>

    <!--操作-->
    <script type="text/html" id="insuranceRecordsListBar">
        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
        <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
        <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="detail">详细</a>
    </script>
</form>
<script type="text/javascript" src="resources/layui/layui/layui.js"></script>
<script th:inline="none">
    layui.use(['form','layer','laydate','table','laytpl'],function(){
        var form = layui.form,
            layer = parent.layer === undefined ? layui.layer : top.layer,
            $ = layui.jquery,
            laydate = layui.laydate,
            laytpl = layui.laytpl,
            table = layui.table;
        //保险记录列表
        var tableIns = table.render({
            elem: '#insuranceRecordsList',
            url : 'insuranceRecords',
            page : true,
            height : "full-125",
            limit : 20,
            limits : [10,15,20,25],
            id : "insuranceRecordsListTable",
            cols : [[
                {type: "checkbox", fixed:"left"},
                {field: 'car', title: '车牌号码',width:100, align:"center",templet:function (row) {
                    return row.car.car_no;
                }},
                {field: 'insNo', title: '保险单号',width:120, align:"center"},
                {field: 'insDate', title: '保险日期',width:120, align:"center"},
                {field: 'insType', title: '保险种类',width:100, align:"center",templet:function (row) {
                    return row.insType.name;
                }},
                {field: 'insAmount', title: '保险金额',width:100, align:"center"},
                {field: 'insUnit', title: '保险公司',width:150, align:"center",templet:function (row) {
                    return row.insUnit.name;
                }},
                {field: 'expireDate', title: '到期日期',width:120, align:"center"},
                {field: 'operator', title: '经办人',width:100, align:"center",templet:function (row) {
                    return row.operator.lname;
                }},
                {field: 'remarks', title: '备注', align:"center"},

                {title: '操作', width:180, templet:'#insuranceRecordsListBar',fixed:"right",align:"center"}
            ]]
        });
        $(".search_btn").on("click",function(){
            var carNo = $(".searchVal").val();
            table.reload('insuranceRecordsListTable', {url: "insuranceRecords?car.car_no=" + carNo});
        });
        table.on("tool(insuranceRecordsList)",function (obj) {
            //获取当前行的数据
            var data=obj.data;
            switch (obj.event){
                case 'del':
                    deleteInsuranceRecord(data);
                    break;
                case 'edit':
                    editInsuranceRecord(data);
                    break;
                case 'detail':
                    detail(data);
                    break;
            }
        });

        //进入保险的编辑页面
        function detail(data){
            var index=layui.layer.open({
                title:"保险详细",
                type:2,
                area:['500px', '600px'],
                content:"toInsuranceRecordDetailPage.do",
                success:function (layero,index) {
                    var body = layui.layer.getChildFrame('body', index);//少了这个是不能从父页面向子页面传值的

                    body.contents().find("#carNo").val(data.car.car_no);
                    body.contents().find("#insType").val(data.insType.name);
                    body.contents().find("#insUnit").val(data.insUnit.name);
                    body.contents().find("#operator").val(data.operator.lname);
                    body.contents().find(".insNo").val(data.insNo);
                    body.contents().find(".insDate").val(data.insDate);
                    body.contents().find(".insAmount").val(data.insAmount);
                    body.contents().find(".expireDate").val(data.expireDate);
                    body.contents().find(".remarks").val(data.remarks);
                }
            });
        }

        //进入保险的编辑页面
        function editInsuranceRecord(data){
            var index=layui.layer.open({
                title:"编辑保险",
                type:2,
                content:"toInsuranceRecordEditPage.do",
                success:function (layero,index) {
                    var body = layui.layer.getChildFrame('body', index);//少了这个是不能从父页面向子页面传值的
                    body.contents().find("#id").val(data.id);

                    var cars;
                    var carId = data.car.id;
                    $.ajax({
                        url:'/temp/cars',
                        success:function (data) {
                            cars += "<option value=''>-----请选择-----</option>"
                            for (i = 0; i < data.length; i++) {
                                if(carId==data[i].id){
                                    cars += ("<option value='" + data[i].id + "' selected>" + data[i].car_no + "</option>")
                                }else{
                                    cars += ("<option value='" + data[i].id + "'>" + data[i].car_no + "</option>")
                                }
                            }
                            body.contents().find("#carNo").append(cars);
                        }
                    });

                    var insTypes;
                    var insTypeId = data.insType.id;
                    $.ajax({
                        url:'temp/insTypes',
                        type:'GET',
                        success:function (data) {
                            insTypes += "<option value=''>-----请选择-----</option>"
                            for (i = 0; i < data.length; i++) {
                                if(insTypeId==data[i].id){
                                    insTypes += ("<option value='" + data[i].id + "' selected>" + data[i].name + "</option>")
                                }else{
                                    insTypes += ("<option value='" + data[i].id + "'>" + data[i].name + "</option>")
                                }
                            }
                            body.contents().find("#insType").append(insTypes);
                        }
                    });

                    var insUnits;
                    var insUnitId = data.insUnit.id;
                    $.ajax({
                        url:'temp/insUnits',
                        type:'GET',
                        success:function (data) {
                            insUnits += "<option value=''>-----请选择-----</option>"
                            for (i = 0; i < data.length; i++) {
                                if(insUnitId==data[i].id){
                                    insUnits += ("<option value='" + data[i].id + "' selected>" + data[i].name + "</option>")
                                }else{
                                    insUnits += ("<option value='" + data[i].id + "'>" + data[i].name + "</option>")
                                }
                            }
                            body.contents().find("#insUnit").append(insUnits);
                        }
                    });

                    var operators;
                    var operatorId = data.operator.id;
                    $.ajax({
                        url:'temp/users',
                        type:'GET',
                        success:function (data) {
                            operators += "<option value=''>-----请选择-----</option>"
                            for (i = 0; i < data.length; i++) {
                                if(operatorId==data[i].id){
                                    operators += ("<option value='" + data[i].id + "' selected>" + data[i].lname + "</option>")
                                }else{
                                    operators += ("<option value='" + data[i].id + "'>" + data[i].lname + "</option>")
                                }
                            }
                            body.contents().find("#operator").append(operators);
                        }
                    });

                    body.contents().find(".insNo").val(data.insNo);
                    body.contents().find(".insDate").val(data.insDate);
                    body.contents().find(".insAmount").val(data.insAmount);
                    body.contents().find(".expireDate").val(data.expireDate);
                    body.contents().find(".remarks").val(data.remarks);
                }
            });
            layui.layer.full(index);//全屏显示
        }

        function deleteInsuranceRecord(data){
            $.ajax({
                url:"insuranceRecords/"+data.id,
                type:"DELETE",
                dataType:"json",
                success:function (res) {
                   if(res.code==2010){
                        layer.msg(res.msg);
                        tableIns.reload();//重新刷新表格
                   }
                }
            });
        }
        //完成批量删除
        //批量删除
        $(".delAll_btn").click(function () {
            var checkStatus = table.checkStatus('insuranceRecordsListTable');
            var data = checkStatus.data;
            var uIds = [];
            if(data.length > 0) {
                for (var i in data) {
                    uIds.push(data[i].id);
                }
                layer.confirm('确定删除选中的保险？', {icon: 3, title: '提示信息'}, function (index) {
                    $.ajax({
                        url:"insuranceRecords/deleteBatch",
                        type:"GET",
                        data:{ids:uIds},
                        dataType:"json",
                        success:function (res) {
                            if(res.code==2010){
                                tableIns.reload();
                                layer.close(index);
                            }
                        }
                    });
                })
            }else{
                layer.msg("请选择需要删除的记录");
            }
        });

        //单击添加保险按钮
        $(".addInsuranceRecord_btn").click(function () {
            var index=layui.layer.open({
                title:"添加保险",
                type:2,
                content:"toInsuranceRecordAddPage.do",
                success : function(layero, index){
                   // var body = layui.layer.getChildFrame('body', index);
                }
            });
            //全屏打开窗口
            layui.layer.full(index);
            window.sessionStorage.setItem("index",index);
            //改变窗口大小时，重置弹窗的宽高，防止超出可视区域（如F12调出debug的操作）
            $(window).on("resize",function(){
                layui.layer.full(window.sessionStorage.getItem("index"));
            })
        });
    })
</script>
</body>
</html>